<%@page import="org.springframework.web.context.request.RequestScope"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" 
	pageEncoding="UTF-8" import="koction.model.seller.SellerVO, java.util.List"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
 	<% List<SellerVO> list=(List<SellerVO>)request.getAttribute("sellerList");%>
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
          var data = google.visualization.arrayToDataTable([
            ['판매자', '판매량', '총수익'],
           <%for(int i=0; i<list.size(); i++){%>
           		['<%=list.get(i).getSellerId() %>',<%=list.get(i).getTotalVolume() %>,<%=list.get(i).getTotalPrice() %>],
           <%} %>
          ]);
          var options = {
            title: '판매자별 판매량&총수익',
            hAxis: {title: '판매자'}
          };
          var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
          chart.draw(data, options);
        }
     
      $(document).ready(function(){
    	  $("#totalVolume").click(function drawChart(){
    	          var data = google.visualization.arrayToDataTable([
    	            ['판매자', '판매량', { role: 'style' }],
    	           <%for(int i=0; i<list.size(); i++){%>
    	           		['<%=list.get(i).getSellerId() %>',<%=list.get(i).getTotalVolume() %>, 'blue'],
    	           <%} %>
    	          ]);
    	          var options = {
    	            title: '판매자별 판매량',
    	            hAxis: {title: '판매자'}
    	          };
    	          var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    	          chart.draw(data, options);
    	  });
    	  $("#tatalPrice").click(function drawChart(){
	          var data = google.visualization.arrayToDataTable([
	            ['판매자', '총수익', { role: 'style' }],
	           <%for(int i=0; i<list.size(); i++){%>
	           		['<%=list.get(i).getSellerId() %>',<%=list.get(i).getTotalPrice() %>, 'red'],
	           <%} %>
	          ]);
	          var options = {
				title: '판매자별 총수익',
	            hAxis: {title: '판매자'}
	          };
	          var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
	          chart.draw(data, options);
	 	 });
      });
    </script>
    
<h3>판매자 통계</h3>
<div id="chart_div" style="width: 500px; height: 300px;"></div>
<input type="button" id="totalVolume" value="판매량 차트">
<input type="button" id="tatalPrice" value="총수익 차트">
<br><br>
<table border="1" cellpadding="5" width="700" id="sellerView">
	<thead align="center">
		<tr>
			<th>판매자 ID</th>
			<th>판매명</th>
			<th>판매지</th>
			<th>상품 판매량</th>
			<th>상품 총 수익</th>
		</tr>
	</thead>
	<tbody align="center">
		<c:forEach var="list" items="${requestScope.sellerList}">		
			<tr>
			    <td><a href="salesVolumeContentView.do?sellerId=${list.sellerId }">${list.sellerId }</a></td>										
				<td>${list.sellerName }</td>
				<td>${list.sellerAddress }</td>
				<td>${list.totalVolume }</td>
				<td>${list.totalPrice }</td>
			</tr>		
		</c:forEach>
	</tbody>
</table>